<!--
 * @Descripttion: 
 * @LastEditors: xzh
 * @LastEditTime: 2024-06-10 13:17:42
-->
<template>
  <div class="dashboard-container">
    <template
      v-for="equipDataType in Object.keys(equipDataTypeEnum).filter(
        (x) =>
          !factoryFilterTypeMap[
            Dile_StoreAction.getCurrentFactory()?.name
          ]?.includes(x)
      )"
      :key="equipDataType"
    >
      <EquipDataTypeList
        :equipDataType="equipDataType"
        :dataArr="equipDashboardParam.dataMap[equipDataKeyMap[equipDataType]]"
      />
    </template>
  </div>
</template>

<script setup lang="ts">
import { reactive, toRefs } from "vue";
import {
  equipDataTypeEnum,
  equipDataKeyMap,
  factoryFilterTypeMap,
} from "./index.type";
import EquipDataTypeList from "./equipDataTypeList/index.vue";
import Dile_APi from "@/api";
import Dile_StoreAction from "@/utils/cache/store";
import { object_Inf } from "@/utils/typings/index.type";
import { onMounted } from "vue";

/**
 * @Author: xzh
 * @Descripttion: 设备仪表单参数
 * @Param:
 */
let equipDashboardParam = reactive<object_Inf>({
  loading: false,
  dataMap: {},
  interval: null,
});

onMounted(() => {
  init();
});

/**
 * @Author: xzh
 * @Descripttion: 加载数据源
 * @Param:
 */
let init = async () => {
  let { loading, dataMap } = toRefs(equipDashboardParam);
  try {
    loading.value = true;
    dataMap.value = {
      ...(await Dile_APi.getShapingEquipDashboard()),
    };
  } finally {
    loading.value = false;
  }
};
</script>
<style lang="scss" scoped>
.dashboard-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  :deep(.vxe-table) {
    .vxe-table--header-wrapper,
    .vxe-table--body-wrapper {
      background-color: var(--background-color) !important;
    }
  }
}
</style>
